<!--
- @fileName: index
- @author: LG
- @date: 2020/11/27 12:36
- @description：index
- @update: 2020/11/27 12:36
-->
<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>腾讯课堂-首页</title>
    <!--    引入网站图标   -->
    <link rel="icon" href="../images/favicon.ico" />
    <!--    重置默认样式   -->
    <link rel="stylesheet" href="../css/reset.css" />
    <!-- 公共样式 -->
    <link rel="stylesheet" href="../css/common.css" />
    <!-- 顶部栏和底部栏 -->

    <link rel="stylesheet" href="../css/base.css" />
    <link rel="stylesheet" href="../css/index/index.css" />

    <link rel="stylesheet" href="../css/swiper.min.css" />
    <script src="../js/iconfont.js"></script>
  </head>

  <body>
    <!-- 回到顶部 -->
    <div id="js-jump-container" class="js-jump-container">
      <a
        href="javascript:void(0)"
        class="mod-side-operation__jump-to-top"
        id="js-jump-to-top"
      >
        <svg class="icon" aria-hidden="true">
          <use xlink:href="#icon-huidaodingbu"></use>
        </svg>
      </a>
    </div>

    <!-- 导航栏 -->
    <header class="tx_header_area">
      <div class="container">
        <!-- logo 区域 -->
        <div class="logo_area">
          <h1>
            <a href="index.html" title="腾讯课堂">腾讯课堂</a>
          </h1>
        </div>
        <!-- 分类区域 -->
        <div class="fenClass_area">
          <div class="class_title">
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-category"></use>
            </svg>
            <span>分类</span>
          </div>
          <!-- 分类详情  left_sele是带·的标题类名 -->
          <nav class="class_desc">
            <ul class="desc_tap">
              <li>
                <div class="left_sele">
                  <h3>IT·互联网</h3>
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-arrow-right-copy"></use>
                  </svg>
                </div>
                <div class="left_con">
                  <span>前端开发</span>
                  <span>JAVA</span>
                  <span>产品策划</span>
                </div>
              </li>
              <li>
                <div class="left_sele">
                  <h3>设计·创作</h3>
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-arrow-right-copy"></use>
                  </svg>
                </div>
                <div class="left_con">
                  <span>平面设计</span>
                  <span>室内设计</span>
                  <span>绘画创作</span>
                </div>
              </li>
              <li>
                <div class="left_sele">
                  <h3>电商·营销</h3>
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-arrow-right-copy"></use>
                  </svg>
                </div>
                <div class="left_con">
                  <span>电商平台</span>
                  <span>跨境电商</span>
                  <span>社交电商</span>
                </div>
              </li>
              <li>
                <div class="left_sele">
                  <h3>职业·考证</h3>
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-arrow-right-copy"></use>
                  </svg>
                </div>
                <div class="left_con">
                  <span>公务员</span>
                  <span>教师考试</span>
                  <span>建筑工程</span>
                </div>
              </li>
              <li>
                <div class="left_sele">
                  <h3>升学·考研</h3>
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-arrow-right-copy"></use>
                  </svg>
                </div>
                <div class="left_con">
                  <span>考研</span>
                  <span>大学</span>
                  <span>高中</span>
                  <span>初中</span>
                </div>
              </li>
              <li>
                <div class="left_sele">
                  <h3>兴趣·生活</h3>
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-arrow-right-copy"></use>
                  </svg>
                </div>
                <div class="left_con">
                  <span>摄影</span>
                  <span>乐器演奏</span>
                  <span>美妆</span>
                  <span>育儿</span>
                </div>
              </li>
              <li>
                <div class="left_sele">
                  <h3>语言·留学</h3>
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-arrow-right-copy"></use>
                  </svg>
                </div>
                <div class="left_con">
                  <span>实用英语</span>
                  <span>雅思</span>
                  <span>托福</span>
                </div>
              </li>
            </ul>

            <div class="right_area">
              <div class="right_panel">
                <ul>
                  <li>
                    <h3>互联网产品</h3>
                    <div>
                      <span> 电子竞技 </span>
                      <span> 产品策划 </span>
                      <span> 产品运营 </span>
                      <span> 新媒体营销 </span>
                      <span> SEO </span>
                      <span> SEM </span>
                      <span> 游戏策划</span>
                      <span> 游戏运营</span>
                      <span> 网络营销理论</span>
                    </div>
                  </li>
                  <li>
                    <h3>编程语言</h3>
                    <div>
                      <span>Python </span>
                      <span>Python小课</span>
                      <span> 数据分析 </span>
                      <span> C#/.Net </span>
                      <span> C/C++ </span>
                      <span> PHP</span>
                      <span> Go语言 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>Java开发</h3>
                    <div>
                      <span> Java进阶 </span>
                      <span> Java零基础 </span>
                    </div>
                  </li>
                  <li>
                    <h3>前端开发</h3>
                    <div>
                      <span>0基础就业课</span>
                      <span>实战进阶课</span>
                      <span> 技术专题课</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>移动开发</h3>
                    <div>
                      <span> Android开发 </span>
                      <span>OS开发</span>
                      <span>微信开发</span>
                      <span> 跨平台APP开发</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>网络与运维</h3>
                    <div>
                      <span> Linux运维</span>
                      <span> Python自动化运维</span>
                      <span> DevOps 信息安全</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>游戏开发</h3>
                    <div>
                      <span> Unity3d游戏开发</span>
                      <span> Cocos2d-x游戏开发</span>
                      <span> 游戏服务器开发</span>
                      <span> Html5游戏</span>
                      <span> UE4</span>
                      <span> VR/AR </span>
                      <span> OpenGL</span>
                      <span> 开发 </span>
                      <span> egret </span>
                      <span> 游戏开发 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>软件测试</h3>
                    <div>
                      <span>零基础入门 </span>
                      <span>自动化测试 </span>
                      <span>测试开发 </span>
                      <span>性能测试 </span>
                      <span>其他 </span>
                      <span>ISTQB考证</span>
                    </div>
                  </li>
                  <li>
                    <h3>云计算大数据</h3>
                    <div>
                      <span> 云计算 </span>
                      <span> 大数据 </span>
                      <span> 人工智能 </span>
                      <span> 物联网 </span>
                      <span> 区块链 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>硬件研发</h3>
                    <div>
                      <span>嵌入式开发 </span>
                      <span>IC设计 </span>
                      <span>其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>认证考试</h3>
                    <div>
                      <span> 思科认证 </span>
                      <span> 华为认证 </span>
                      <span> 红帽认证 </span>
                      <span> 软考 </span>
                      <span> 腾讯云认证 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                </ul>
              </div>
              <div class="right_panel">
                <ul>
                  <li>
                    <h3>平面设计</h3>
                    <div>
                      <span> 电商美工 </span>
                      <span> 综合平面设计 </span>
                      <span> 摄影后期</span>
                    </div>
                  </li>
                  <li>
                    <h3>设计软件</h3>
                    <div>
                      <span> Photoshop </span><span> Indesign</span>
                      <span> Axure </span> <span> CDR </span>
                      <span> Illustrator</span> <span> Dreamweaver </span>
                      <span> CAD</span> <span> UG </span>
                      <span> Solidworks </span> <span> Sketchup</span>
                      <span> Rhino3D </span> <span> Pro/E </span>
                      <span> ZBrush </span> <span> Cinema </span>
                    </div>
                  </li>
                  <li>
                    <h3>环境艺术设计</h3>
                    <div>
                      <span> 室内设计</span>
                      <span> 建筑设计 </span>
                      <span> 景观设计 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>绘画创作</h3>
                    <div>
                      <span> 插画 </span>
                      <span> 漫画绘本 </span>
                      <span> 国画油画 </span>
                      <span> 水彩水粉画</span>
                      <span> 素描 </span>
                      <span> 彩铅手绘 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>工业产品设计</h3>
                    <div>
                      <span> 模具设计 </span>
                      <span> 机械设计 </span>
                      <span> 产品设计</span>
                      <span> 智能制造 </span>
                      <span> 包装设计 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>UI设计</h3>
                    <div>
                      <span> 交互设计 </span>
                      <span> 游戏UI设计</span>
                      <span> Web</span>
                      <span> UI设计</span>
                      <span> APP</span>
                      <span> UI设计</span>
                      <span> 腾讯设计学院</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>游戏美术设计</h3>
                    <div>
                      <span> 游戏角色设计</span>
                      <span> 场景概念设计</span>
                      <span> 游戏模型设计 </span>
                      <span> 游戏特效设计</span>
                      <span> 游戏美宣</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>影视设计</h3>
                    <div>
                      <span> 动画设计</span>
                      <span> 包装与剪辑 </span>
                      <span> 特效与后期 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>服装设计</h3>
                    <div>
                      <span> 服装设计</span>
                      <span> 服装打版 </span>
                      <span> 配饰设计</span>
                      <span> 其他 </span>
                    </div>
                  </li>
                  <li>
                    <h3>其他</h3>
                    <div>
                      <span>其他</span>
                    </div>
                  </li>
                </ul>
              </div>
              <div class="right_panel">
                <ul>
                  <li>
                    <h3>电商平台</h3>
                    <div>
                      <span> 淘宝营销 </span>
                      <span> 拼多多营销 </span>
                      <span> 京东营销 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>跨境电商</h3>
                    <div>
                      <span> 亚马逊 </span>
                      <span> Shopee(虾皮)</span>
                      <span> 速卖通</span>
                      <span> 阿里国际站</span>
                      <span> 独立站</span>
                      <span> 其他平台</span>
                    </div>
                  </li>
                  <li>
                    <h3>社交电商</h3>
                    <div>
                      <span>直播短视频电商 </span>
                      <span>微信电商</span>
                      <span> 社群营销</span>
                      <span> 自媒体营销</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>其他</h3>
                    <div>
                      <span>其他</span>
                    </div>
                  </li>
                </ul>
              </div>
              <div class="right_panel">
                <ul>
                  <li>
                    <h3>互联网产品</h3>
                    <div>
                      <span> 电子竞技 </span>
                      <span> 产品策划 </span>
                      <span> 产品运营 </span>
                      <span> 新媒体营销 </span>
                      <span> SEO </span>
                      <span> SEM </span>
                      <span> 游戏策划</span>
                      <span> 游戏运营</span>
                      <span> 网络营销理论</span>
                    </div>
                  </li>
                  <li>
                    <h3>编程语言</h3>
                    <div>
                      <span>Python </span>
                      <span>Python小课</span>
                      <span> 数据分析 </span>
                      <span> C#/.Net </span>
                      <span> C/C++ </span>
                      <span> PHP</span>
                      <span> Go语言 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>Java开发</h3>
                    <div>
                      <span> Java进阶 </span>
                      <span> Java零基础 </span>
                    </div>
                  </li>
                  <li>
                    <h3>前端开发</h3>
                    <div>
                      <span>0基础就业课</span>
                      <span>实战进阶课</span>
                      <span> 技术专题课</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>移动开发</h3>
                    <div>
                      <span> Android开发 </span>
                      <span>OS开发</span>
                      <span>微信开发</span>
                      <span> 跨平台APP开发</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>网络与运维</h3>
                    <div>
                      <span> Linux运维</span>
                      <span> Python自动化运维</span>
                      <span> DevOps 信息安全</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>游戏开发</h3>
                    <div>
                      <span> Unity3d游戏开发</span>
                      <span> Cocos2d-x游戏开发</span>
                      <span> 游戏服务器开发</span>
                      <span> Html5游戏</span>
                      <span> UE4</span>
                      <span> VR/AR </span>
                      <span> OpenGL</span>
                      <span> 开发 </span>
                      <span> egret </span>
                      <span> 游戏开发 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>软件测试</h3>
                    <div>
                      <span>零基础入门 </span>
                      <span>自动化测试 </span>
                      <span>测试开发 </span>
                      <span>性能测试 </span>
                      <span>其他 </span>
                      <span>ISTQB考证</span>
                    </div>
                  </li>
                  <li>
                    <h3>云计算大数据</h3>
                    <div>
                      <span> 云计算 </span>
                      <span> 大数据 </span>
                      <span> 人工智能 </span>
                      <span> 物联网 </span>
                      <span> 区块链 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>硬件研发</h3>
                    <div>
                      <span>嵌入式开发 </span>
                      <span>IC设计 </span>
                      <span>其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>认证考试</h3>
                    <div>
                      <span> 思科认证 </span>
                      <span> 华为认证 </span>
                      <span> 红帽认证 </span>
                      <span> 软考 </span>
                      <span> 腾讯云认证 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                </ul>
              </div>
              <div class="right_panel">
                <ul>
                  <li>
                    <h3>平面设计</h3>
                    <div>
                      <span> 电商美工 </span>
                      <span> 综合平面设计 </span>
                      <span> 摄影后期</span>
                    </div>
                  </li>
                  <li>
                    <h3>设计软件</h3>
                    <div>
                      <span> Photoshop </span><span> Indesign</span>
                      <span> Axure </span> <span> CDR </span>
                      <span> Illustrator</span> <span> Dreamweaver </span>
                      <span> CAD</span> <span> UG </span>
                      <span> Solidworks </span> <span> Sketchup</span>
                      <span> Rhino3D </span> <span> Pro/E </span>
                      <span> ZBrush </span> <span> Cinema </span>
                    </div>
                  </li>
                  <li>
                    <h3>环境艺术设计</h3>
                    <div>
                      <span> 室内设计</span>
                      <span> 建筑设计 </span>
                      <span> 景观设计 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>绘画创作</h3>
                    <div>
                      <span> 插画 </span>
                      <span> 漫画绘本 </span>
                      <span> 国画油画 </span>
                      <span> 水彩水粉画</span>
                      <span> 素描 </span>
                      <span> 彩铅手绘 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>工业产品设计</h3>
                    <div>
                      <span> 模具设计 </span>
                      <span> 机械设计 </span>
                      <span> 产品设计</span>
                      <span> 智能制造 </span>
                      <span> 包装设计 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>UI设计</h3>
                    <div>
                      <span> 交互设计 </span>
                      <span> 游戏UI设计</span>
                      <span> Web</span>
                      <span> UI设计</span>
                      <span> APP</span>
                      <span> UI设计</span>
                      <span> 腾讯设计学院</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>游戏美术设计</h3>
                    <div>
                      <span> 游戏角色设计</span>
                      <span> 场景概念设计</span>
                      <span> 游戏模型设计 </span>
                      <span> 游戏特效设计</span>
                      <span> 游戏美宣</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>影视设计</h3>
                    <div>
                      <span> 动画设计</span>
                      <span> 包装与剪辑 </span>
                      <span> 特效与后期 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>服装设计</h3>
                    <div>
                      <span> 服装设计</span>
                      <span> 服装打版 </span>
                      <span> 配饰设计</span>
                      <span> 其他 </span>
                    </div>
                  </li>
                  <li>
                    <h3>其他</h3>
                    <div>
                      <span>其他</span>
                    </div>
                  </li>
                </ul>
              </div>
              <div class="right_panel">
                <ul>
                  <li>
                    <h3>电商平台</h3>
                    <div>
                      <span> 淘宝营销 </span>
                      <span> 拼多多营销 </span>
                      <span> 京东营销 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>跨境电商</h3>
                    <div>
                      <span> 亚马逊 </span>
                      <span> Shopee(虾皮)</span>
                      <span> 速卖通</span>
                      <span> 阿里国际站</span>
                      <span> 独立站</span>
                      <span> 其他平台</span>
                    </div>
                  </li>
                  <li>
                    <h3>社交电商</h3>
                    <div>
                      <span>直播短视频电商 </span>
                      <span>微信电商</span>
                      <span> 社群营销</span>
                      <span> 自媒体营销</span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>其他</h3>
                    <div>
                      <span>其他</span>
                    </div>
                  </li>
                </ul>
              </div>
              <div class="right_panel">
                <ul>
                  <li>
                    <h3>平面设计</h3>
                    <div>
                      <span> 电商美工 </span>
                      <span> 综合平面设计 </span>
                      <span> 摄影后期</span>
                    </div>
                  </li>

                  <li>
                    <h3>环境艺术设计</h3>
                    <div>
                      <span> 室内设计</span>
                      <span> 建筑设计 </span>
                      <span> 景观设计 </span>
                      <span> 其他</span>
                    </div>
                  </li>

                  <li>
                    <h3>工业产品设计</h3>
                    <div>
                      <span> 模具设计 </span>
                      <span> 机械设计 </span>
                      <span> 产品设计</span>
                      <span> 智能制造 </span>
                      <span> 包装设计 </span>
                      <span> 其他</span>
                    </div>
                  </li>
                  <li>
                    <h3>UI设计</h3>
                    <div>
                      <span> 交互设计 </span>
                      <span> 游戏UI设计</span>
                      <span> Web</span>
                      <span> UI设计</span>
                      <span> APP</span>
                      <span> UI设计</span>
                      <span> 腾讯设计学院</span>
                      <span> 其他</span>
                    </div>
                  </li>

                  <li>
                    <h3>其他</h3>
                    <div>
                      <span>其他</span>
                    </div>
                  </li>
                </ul>
              </div>
            </div>
          </nav>
        </div>

        <!-- 搜索区域 -->

        <div class="seachar_area">
          <div class="seachar_selc">
            <span>
              课程
              <svg class="icon" aria-hidden="true">
                <use xlink:href="#icon-arrow"></use>
              </svg>
            </span>
          </div>
          <div class="seachar_input">
            <input type="text" class="" placeholder="搜索课程" />
            <div class="btn_search" style="cursor: pointer">
              <svg class="icon" aria-hidden="true">
                <use xlink:href="#icon-iconfontsousuo"></use>
              </svg>
            </div>
          </div>

          <!-- 历史搜索 -->
          <div class="history_search">
            <div class="his_search">
              <div class="his_title">
                <span>历史搜索</span>
                <span class="empty">
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-lajitong"></use>
                  </svg>
                  清空
                </span>
              </div>
              <div class="his_con"></div>
            </div>
            <div class="hot_search">
              <div class="hot_title">
                <span>热门搜索</span>
              </div>
              <div class="hot_con">
                <a href="javascript:;" title="Vue">Vue</a>
                <a href="javascript:;" title="Java">Java</a>
                <a href="javascript:;" title="python">python</a>
                <a href="javascript:;" title="拼多多">拼多多</a>
              </div>
            </div>
          </div>
        </div>

        <!-- 右边栏信息+个人信息 -->
        <div class="rightKH_area">
          <div class="right_common">
            <p class="">入驻/合作</p>
            <ul class="right_select">
              <li><a title="个人入驻" target="_blank">个人入驻</a></li>
              <li><a title="机构入驻" target="_blank">机构入驻</a></li>
              <li>
                <a title="分销课程 " target="_blank">分销课程</a>
              </li>
              <li>
                <a title="企业合作" target="_blank">企业合作</a>
              </li>
            </ul>
          </div>
          <div class="right_common quick_download">极速版</div>
          <div class="right_common" style="margin-left: 40px">
            <p class="">客户端</p>
            <ul class="right_select">
              <li><a title="Win客户端" target="_blank">Win客户端</a></li>
              <li><a title="Mac客户端" target="_blank">Mac客户端</a></li>
              <li>
                <a title="App客户端 " target="_blank">App客户端</a>
              </li>
            </ul>
          </div>
          <div class="right_common">私信</div>
          <div class="right_common loginStatus">
            <a class="" href="./login.html"> 登录</a>
            <div>
              <div class="login_sucess">
                <div>
                  <img src="../images/index/qqimg.jpg" alt="" />
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-QQ"></use>
                  </svg>
                </div>
                <span>LG</span>
              </div>
              <ul class="right_select">
                <li><a title="课程表" target="_blank">课程表</a></li>
                <li>
                  <a href="allOrder.html" title="全部订单" target="_blank"
                    >全部订单</a
                  >
                </li>
                <li>
                  <a title="退出登录 " class="loginOut">退出登录</a>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </header>

    <!-- 轮播图区域 -->
    <section class="banner_area">
      <div class="mod-entry">
        <div class="entry_login">
          <div class="unlogin">
            <p>跟进你的学习进度</p>
            <div class="img"></div>
            <a href="./login.html">登录</a>
          </div>
          <div class="suclogin">
            <div class="userinfo">
              <div>
                <img src="../images/index/qqimg.jpg" alt="" />
                <span></span>
              </div>
              <a href="javascript:;" title="退出" class="indexLoginOut">退出</a>
            </div>
            <div
              style="
                display: flex;
                justify-content: space-between;
                border-bottom: 1px solid #e5e5e5;
              "
            >
              <span>1门课程</span>
              <span>0门收藏</span>
            </div>
            <div
              style="
                display: flex;
                align-items: center;
                color: #999;
                font-size: 14px;
                margin-top: 10px;
              "
            >
              <img
                src="../images/index/hear_zanwu.png"
                alt=""
                width="70px"
                height="70px"
              />
              <span>今日暂无课程</span>
            </div>
            <div
              style="
                color: #333;
                background-color: #f6f6f6;
                line-height: 40px;
                margin-top: 10px;
                height: 40px;
              "
            >
              <svg class="icon" aria-hidden="true">
                <use xlink:href="#icon-kebiao-weixuanzhong"></use>
              </svg>
              <a href="javascript:;">我的课表</a>
            </div>
          </div>
        </div>
      </div>
      <div class="banner_container">
        <div class="swiper-container">
          <div class="swiper-wrapper">
            <div class="swiper-slide" style="background-color: #ff4900">
              <img
                src="../images/index/banner_1.png"
                alt=""
                title=" 在线精品课程"
              />
            </div>
            <div class="swiper-slide" style="background-color: #ffd044">
              <img
                src="../images/index/banner_2.jpg"
                alt=""
                title="IT互联网 在线精品课程"
              />
            </div>
            <div class="swiper-slide" style="background-color: #303145">
              <img
                src="../images/index/banner_3.jpg"
                alt=""
                title="移动开发 在线精品课程"
              />
            </div>
            <div class="swiper-slide" style="background-color: #bf1c2d">
              <img
                src="../images/index/banner_4.jpg"
                alt=""
                title="前端开发 在线精品课程"
              />
            </div>
            <div class="swiper-slide" style="background-color: #0235cf">
              <img
                src="../images/index/banner_5.jpg"
                alt=""
                title="前端开发 在线精品课程"
              />
            </div>
            <div class="swiper-slide" style="background-color: #040f4d">
              <img
                src="../images/index/banner_6.jpg"
                alt=""
                title="前端开发 在线精品课程"
              />
            </div>
          </div>
          <!-- Add Pagination -->
          <div class="swiper-pagination swiper-pagination-white"></div>
          <!-- Add Arrows -->
          <div class="swiper-button-next swiper-button-white"></div>
          <div class="swiper-button-prev swiper-button-white"></div>
        </div>
      </div>
    </section>

    <!-- tabs栏 -->
    <section class="cate-tab">
      <ul class="top container">
        <li class="xuanzhong">前端</li>
        <li>移动开发</li>
        <li>兴趣职场</li>
      </ul>
    </section>
    <section class="container">
      <div class="cate_item" id="front" style="display: block">
        <h2>前端精选</h2>

        <!-- 直播区域 -->
        <div class="select_live">
          <div class="live_content">
            <div style="display: block">
              <a href="javascript:;">
                <img src="../images/index/live1.jpg" alt="" />
                <div class="text_tit">
                  <p class="desc_p">CSS3酷炫导航栏</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live2.jpg" alt="" />
                <div class="text_tit">
                  <p class="desc_p">WEB大厂核心技术解密</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live3.png" />
                <div class="text_tit">
                  <p class="desc_p">大佬手把手带你用Vue实现购物车需求</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live4.jpg" alt="" />
                <div class="text_tit">
                  <p class="desc_p">游戏官网手风琴特效</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live5.jpg" />
                <div class="text_tit">
                  <p class="desc_p">手把手带你打造天猫侧边栏特效</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live6.jpg" alt="" />
                <div class="text_tit">
                  <p class="desc_p">WEB大厂核心技术解密</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live1.jpg" alt="" />
                <div class="text_tit">
                  <p class="desc_p">IOS的高级进阶之路</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
          </div>
          <div class="wrapper">
            <div class="time-axis"></div>
            <ul id="left">
              <li>
                <b>·</b>
                <span>20:00</span> <a href="javascript:;">CSS3酷炫导航栏</a>
              </li>
              <li>
                <b>·</b>
                <span>21:00</span>
                <a href="javascript:;">WEB大厂核心技术解密</a>
              </li>
              <li>
                <img src="../images/index/living.gif" alt="" />
                <span class="living">直播中</span>
                <a href="javascript:;">大佬手把手带你用Vue实现购物车需求</a>
              </li>
              <li>
                <b>·</b>

                <span>20:30</span><a href="javascript:;">游戏官网手风琴特效</a>
              </li>
              <li>
                <img src="../images/index/living.gif" alt="" />
                <span class="living">直播中</span>
                <a href="javascript:;">手把手带你打造天猫侧边栏特效</a>
              </li>
              <li>
                <img src="../images/index/living.gif" alt="" />
                <span class="living">直播中</span>

                <a href="javascript:;">WEB大厂核心技术解密</a>
              </li>
              <li>
                <b>·</b>
                <span>18:00</span>
                <a href="javascript:;">IOS的高级进阶之路</a>
              </li>
            </ul>
          </div>
        </div>

        <!-- 腾讯课堂官方推荐 -->
        <h2 style="padding: 70px 0 40px 0; border-bottom: 5px solid #f4f4f4">
          腾讯课堂官方推荐：前端开发零基础入门训练营
        </h2>
        <ul class="recommended_area">
          <li>
            <a class="item-hd" title="前端权威0基础训练营" href="javascript:;">
              <img
                class="item-cover"
                src="../images/index/recommended1.jpg"
                alt="封面背景"
              />
              <div class="item-hd-mask"></div>
              <div class="item-hd-wrap">
                <h3 class="item-tt">前端权威0基础训练营</h3>
                <p class="item-wording">适合对象：在职转行，应届毕业生</p>
                <p class="item-wording">平均薪资：10K+</p>
              </div>
            </a>
            <div class="item-bd">
              <a
                class="item-bd-wrap js-series-content"
                title="前端权威0基础训练营"
                href=""
                style="max-height: 160px"
              >
                <h4 class="item-ctt">渡一教育 实战项目</h4>
                <p class="item-content">
                  01 <span class="item-wording-txt">前端权威0基础入门</span>
                </p>
                <p class="item-content">
                  02 <span class="item-wording-txt">Web百大项目案例</span>
                </p>
                <p class="item-content">
                  03
                  <span class="item-wording-txt"
                    >深化基础和夯实底层编程能力</span
                  >
                </p>
              </a>
            </div>
          </li>
          <li>
            <a class="item-hd" title="高薪就业训练营" href="javascript:;">
              <img
                class="item-cover"
                src="../images/index/recommended2.jpg"
                alt="封面背景"
              />
              <div class="item-hd-mask"></div>
              <div class="item-hd-wrap">
                <h3 class="item-tt">高薪就业训练营</h3>
                <p class="item-wording">适合对象：在职转行，应届毕业生</p>
                <p class="item-wording">平均薪资：10K+</p>
              </div>
            </a>
            <div class="item-bd">
              <a
                class="item-bd-wrap js-series-content"
                title="高薪就业训练营"
                href="javascript:;"
                style="max-height: 160px"
              >
                <h4 class="item-ctt">职坐标 实战项目</h4>
                <p class="item-content">
                  01
                  <span class="item-wording-txt">保姆级课程服务治愈懒癌</span>
                </p>
                <p class="item-content">
                  02
                  <span class="item-wording-txt"
                    >零基础到精通，项目驱动式教学</span
                  >
                </p>
                <p class="item-content">
                  03
                  <span class="item-wording-txt"
                    >VIP就业通道限时开启，就业无压力</span
                  >
                </p>
              </a>
            </div>
          </li>
          <li>
            <a class="item-hd" title="零基础就业课" href="javascript:;">
              <img
                class="item-cover"
                src="../images/index/recommended3.jpg"
                alt="封面背景"
              />
              <div class="item-hd-mask"></div>
              <div class="item-hd-wrap">
                <h3 class="item-tt">零基础就业课</h3>
                <p class="item-wording">适合对象：想要转行，想拿高薪的同学</p>
                <p class="item-wording">入行平均薪资：8k</p>
              </div>
            </a>
            <div class="item-bd">
              <a
                class="item-bd-wrap js-series-content"
                title="零基础就业课"
                href="javascript:;"
                style="max-height: 160px"
              >
                <h4 class="item-ctt">六星教育 实战项目</h4>
                <p class="item-content">
                  01
                  <span class="item-wording-txt">零基础高薪就业快速入门</span>
                </p>
                <p class="item-content">
                  02 <span class="item-wording-txt">理论+项目案例结合讲解</span>
                </p>
                <p class="item-content">
                  03
                  <span class="item-wording-txt">10S服务体系保障高薪就业</span>
                </p>
              </a>
            </div>
          </li>
          <li>
            <a class="item-hd" title="实战项目训练营" href="javascript:;">
              <img
                class="item-cover"
                src="../images/index/recommended4.jpg"
                alt="封面背景"
              />
              <div class="item-hd-mask"></div>
              <div class="item-hd-wrap">
                <h3 class="item-tt">实战项目训练营</h3>
                <p class="item-wording">适合对象：零基础小白</p>
                <p class="item-wording">学员平均薪资：8K+</p>
              </div>
            </a>
            <div class="item-bd">
              <a
                class="item-bd-wrap js-series-content"
                title="实战项目训练营"
                href="javascript:;"
                style="max-height: 160px"
              >
                <h4 class="item-ctt">小码哥教育 实战项目</h4>
                <p class="item-content">
                  01 <span class="item-wording-txt">快速入门前端开发</span>
                </p>
                <p class="item-content">
                  02 <span class="item-wording-txt">即学即用的大厂技术</span>
                </p>
                <p class="item-content">
                  03 <span class="item-wording-txt">解决找工作难的问题</span>
                </p>
              </a>
            </div>
          </li>
        </ul>

        <!-- 精选公开课 -->
        <h2 style="padding: 70px 0 0 0">精选公开课</h2>
        <p
          style="
            text-align: center;
            margin-top: 10px;
            padding-bottom: 25px;
            color: #9999b3;
            border-bottom: 5px solid #f4f4f4;
          "
        >
          机构教学特色免费体验
        </p>
        <ul class="course-card-list">
          <li class="course-card-item--v3 js-course-card-item">
            <a href="javascript:;" class="item-img-link">
              <img
                src="../images/index/gongkai1.jpg"
                alt="2020逆袭web前端高级开发 | JS/React/VueJS/NodeJS框架实战"
                title="2020逆袭web前端高级开发 | JS/React/VueJS/NodeJS框架实战"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="2020逆袭web前端高级开发 | JS/React/VueJS/NodeJS框架实战"
                >2020逆袭web前端高级开发 | JS/React/VueJS/NodeJS框架实战</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">共195节</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="职坐标"
                >职坐标</a
              >
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">免费</span>
              <span class="line-cell item-user"> 1556人最近报名 </span>
            </div>
          </li>
          <li class="course-card-item--v3 js-course-card-item">
            <a href="javascript:;" class="item-img-link">
              <img
                src="../images/index/gongkai2.jpg"
                alt="Web前端开发JavaScript权威课堂"
                title="Web前端开发JavaScript权威课堂"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="Web前端开发JavaScript权威课堂"
                >Web前端开发JavaScript权威课堂</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">共59节</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="职坐标"
                >渡一教育</a
              >
              <a
                target="_blank"
                href="javascript:;"
                class="line-cell item-source-tag"
                title="类目认证机构"
              ></a>
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">免费</span>
              <span class="line-cell item-user"> 3332人最近报名 </span>
            </div>
          </li>
          <li class="course-card-item--v3 js-course-card-item">
            <a href="javascript:;" class="item-img-link">
              <img
                src="../images/index/gongkai3.jpg"
                alt="月薪过万 Web前端零基础入门HTML/CSS/JavaScript - 大神精选"
                title="月薪过万 Web前端零基础入门HTML/CSS/JavaScript - 大神精选"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="月薪过万 Web前端零基础入门HTML/CSS/JavaScript - 大神精选"
                >月薪过万 Web前端零基础入门HTML/CSS/JavaScript - 大神精选</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">共168节</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="小码哥教育"
                >小码哥教育</a
              >
              <a
                href="javascript:;"
                class="line-cell item-source-tag"
                title="类目认证机构"
              ></a>
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">¥0.99</span>
              <span class="line-cell item-discount-tag">限时优惠</span>
              <span class="line-cell item-price item-price--origin">¥99</span>
              <span class="line-cell item-user"> 5412人购买 </span>
            </div>
          </li>
          <li class="course-card-item--v3 js-course-card-item">
            <a href="javascript:;" class="item-img-link">
              <img
                src="../images/index/gongkai4.png"
                alt="资深前端手把手用实战教你冲击月薪3万"
                title="资深前端手把手用实战教你冲击月薪3万"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="资深前端手把手用实战教你冲击月薪3万"
                >资深前端手把手用实战教你冲击月薪3万</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">共195节</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="京程一灯"
                >京程一灯</a
              >

              <a
                href="javascript:;"
                class="line-cell item-source-tag"
                title="类目认证机构"
              ></a>
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">免费</span>
              <span class="line-cell item-user"> 438人最近报名 </span>
            </div>
          </li>
          <li class="course-card-item--v3 js-course-card-item">
            <a href="javascript:;" class="item-img-link">
              <img
                src="../images/index/gongkai5.png"
                alt="珠峰架构前端技术公开课"
                title="珠峰架构前端技术公开课"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="珠峰架构前端技术公开课"
                >珠峰架构前端技术公开课</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">共47节</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="珠峰架构学院"
                >珠峰架构学院</a
              >
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">免费</span>
              <span class="line-cell item-user"> 310人最近报名 </span>
            </div>
          </li>
          <li class="course-card-item--v3 js-course-card-item">
            <a href="javascript:;" class="item-img-link">
              <img
                src="../images/index/gongkai6.jpg"
                alt="VueCli3全新小白入门教程(基础+实战+vue+fetch+axios+米斯特别精选"
                title="VueCli3全新小白入门教程(基础+实战+vue+fetch+axios+米斯特别精选"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="VueCli3全新小白入门教程(基础+实战+vue+fetch+axios+米斯特别精选"
                >VueCli3全新小白入门教程(基础+实战+vue+fetch+axios+米斯特别精选</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">共34节</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="米修在线"
                >米修在线</a
              >
              <a
                href="javascript:;"
                class="line-cell item-source-tag"
                title="类目认证机构"
              ></a>
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">¥2.00</span>
              <span class="line-cell item-discount-tag">限时优惠</span>
              <span class="line-cell item-price item-price--origin">¥188</span>
              <span class="line-cell item-user"> 1234人购买 </span>
            </div>
          </li>
          <li class="course-card-item--v3 js-course-card-item">
            <a href="../html/Payvideo.html" class="item-img-link">
              <img
                src="../images/index/gongkai7.png"
                alt="JavaScript开发贪吃蛇小游戏实战开发"
                title="JavaScript开发贪吃蛇小游戏实战开发"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="JavaScript开发贪吃蛇小游戏实战开发"
                >JavaScript开发贪吃蛇小游戏实战开发</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">2020-12-16开奖</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="京程一灯就业班"
                >京程一灯就业班</a
              >
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">¥0.02</span>
              <span class="line-cell item-discount-tag">限时优惠</span>
              <span class="line-cell item-price item-price--origin">¥98</span>
              <span class="line-cell item-user"> 12人购买 </span>
            </div>
          </li>
          <li class="course-card-item--v3 js-course-card-item">
            <a href="javascript:;" class="item-img-link">
              <img
                src="../images/index/gongkai8.png"
                alt="2020逆袭web前端高级开发 | JS/React/VueJS/NodeJS框架实战"
                title="2020逆袭web前端高级开发 | JS/React/VueJS/NodeJS框架实战"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="2020逆袭web前端高级开发 | JS/React/VueJS/NodeJS框架实战"
                >2020逆袭web前端高级开发 | JS/React/VueJS/NodeJS框架实战</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">共195节</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="金渡教育"
                >金渡教育</a
              >
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">免费</span>
              <span class="line-cell item-user"> 9万+人报名 </span>
            </div>
          </li>
          <li class="course-card-item--v3 js-course-card-item">
            <a href="javascript:;" class="item-img-link">
              <img
                src="../images/index/gongkai9.png"
                alt="2020逆袭web前端高级开发"
                title="2020逆袭web前端高级开发"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="2020逆袭web前端高级开发"
                >2020逆袭web前端高级开发</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">共195节</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="职坐标"
                >职坐标</a
              >
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">免费</span>
              <span class="line-cell item-user"> 1556人最近报名 </span>
            </div>
          </li>
          <li class="course-card-item--v3 js-course-card-item">
            <a href="javascript:;" class="item-img-link">
              <img
                src="../images/index/gongkai10.png"
                alt=" JS/React/VueJS/NodeJS框架实战"
                title="JS/React/VueJS/NodeJS框架实战"
                class="item-img"
                width="220"
                height="124"
              />
              <div class="item-status"></div>
            </a>
            <h4 class="item-tt">
              <a
                href="javascript:;"
                class="item-tt-link js-course-name"
                title="2JS/React/VueJS/NodeJS框架实战"
                >JS/React/VueJS/NodeJS框架实战</a
              >
            </h4>
            <div class="item-line item-line--middle">
              <span class="line-cell item-task">共120节</span>
              <a
                href="javascript:;"
                class="line-cell item-source-link js-agency-name"
                style="max-width: 155px"
                title="黑马"
                >黑马</a
              >
              <a
                href="javascript:;"
                class="line-cell item-source-tag"
                title="类目认证机构"
              ></a>
            </div>
            <div class="item-line item-line--bottom">
              <span class="line-cell item-price">¥.00</span>
              <span class="line-cell item-discount-tag">拼团！！</span>
              <span class="line-cell item-price item-price--origin">¥188</span>
              <span class="line-cell item-user"> 3w人购买 </span>
            </div>
          </li>
        </ul>

        <!-- 分割图片 -->
        <div
          class="mod-sub img-entry-wrapper js-img-entry"
          style="margin-bottom: 55px; width: 100%; padding-top: 30px"
        >
          <a
            class="img-entry"
            href="javascript:;"
            style="
              background: url('../images/index/fenGe.png') no-repeat center;
              cursor: pointer;
              display: block;
              background-position: 50%;
              max-width: 1200px;
              margin: 0 auto;
              min-height: 220px;
            "
          >
          </a>
        </div>

        <!-- 热门知识 -->
        <h2 style="padding: 0px 0 40px 0">热门知识</h2>
        <div class="knowledge">
          <a href="javascript:;"
            >mpacc培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>

          <a href="javascript:;">
            php培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            plc编程培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            淘宝运营培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            算法工程师培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            游戏开发培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            物联网培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ga培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            人工智能培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ie工程师培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            安卓系统培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            产品培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            asp培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            软件开发培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            思维导图培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            电脑培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            程序员培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            编程培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            cad2014安装教程
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            cnc编程培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            交互设计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            软装设计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ps教程
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            unity培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            视觉传达设计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            零基础素描培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ps怎么抠图
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            服装制作培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            版面设计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            影视剪辑培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            视频编辑培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ps如何抠图
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            平面培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            3d特效培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            电商美工培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ps字体
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>

          <a href="javascript:;">
            注会培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a>
            我
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            医院管理培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            会计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            财务管理培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            工程测量员培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            公务员培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            水电工培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            政法培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            国际贸易培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            婚礼主持人培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            导游培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            医师培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            内审培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            家政培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            cfa培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            电焊培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            护师培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            传媒培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            汽车维修培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            礼仪培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            奥数培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            小学奥数培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            初中教育培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            党员培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            考研培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            作文培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            专升本培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            手绘pop培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            考研英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            高中化学培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            医学考研培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            物理培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语四级培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语六级培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            速算培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            寿司培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            舞蹈培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            自信培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            拳击培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            创业培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            儿童舞蹈培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            唢呐培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            化妆培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            瑜伽培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            周易培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            美容培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            理发培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            采耳培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            体操培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            传统文化培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            肚皮舞培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            美容美发培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            轮滑培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            架子鼓培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            彩妆培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            西班牙语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            托福培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            雅思培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            日语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            法语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            bec高级培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            雅思班培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            俄语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            韩语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            少儿英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语口语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            情商培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            一对一英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            出国留学培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            新概念英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            gmat培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            toefl培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语专八培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
        </div>
      </div>
    </section>
    <section class="container">
      <div class="cate_item" id="mobile">
        <h2>移动直播课</h2>
        <div class="select_live">
          <div class="live_content live_content2">
            <div style="display: block">
              <a href="javascript:;">
                <img src="../images/index/live7.jpg" alt="" />
                <div class="text_tit">
                  <p class="desc_p">架构师核心 技术-框架设计通用技术分享</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live8.png" alt="" />
                <div class="text_tit">
                  <p class="desc_p">setContent中到底发生了什么?</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live3.png" />
                <div class="text_tit">
                  <p class="desc_p">XML解析过程分析</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live9.jpg" alt="" />
                <div class="text_tit">
                  <p class="desc_p">游戏官网手风琴特效</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live2.jpg" />
                <div class="text_tit">
                  <p class="desc_p">手把手带你打造天猫侧边栏特效</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live6.jpg" alt="" />
                <div class="text_tit">
                  <p class="desc_p">WEB大厂核心技术解密</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
            <div>
              <a href="javascript:;">
                <img src="../images/index/live1.jpg" alt="" />
                <div class="text_tit">
                  <p class="desc_p">IOS的高级进阶之路</p>
                  <a href="./videoPlay.html" class="quickSignUp">立即试听</a>
                </div>
              </a>
            </div>
          </div>
          <div class="wrapper">
            <div class="time-axis"></div>
            <ul id="left2">
              <li>
                <img src="../images/index/living.gif" alt="" />
                <span class="living">直播中</span>
                <a href="javascript:;">架构师核心 技术-框架设计通用技术分享</a>
              </li>
              <li>
                <img src="../images/index/living.gif" alt="" />
                <span class="living">直播中</span>

                <a href="javascript:;">setContent中到底发生了什么?</a>
              </li>
              <li>
                <b>·</b>
                <span>21:00</span>
                <a href="javascript:;">XML解析过程分析</a>
              </li>
              <li>
                <b>·</b>
                <span>22:00</span
                ><a href="javascript:;">MediaCodec编码原理详解</a>
              </li>
              <li>
                <img src="../images/index/living.gif" alt="" />
                <span class="living">直播中</span>
                <a href="javascript:;">5G时代android技术突破点——NDK开发应用</a>
              </li>
              <li>
                <img src="../images/index/living.gif" alt="" />
                <span class="living">直播中</span>

                <a href="javascript:;">WEB大厂核心技术解密</a>
              </li>
              <li>
                <b>·</b>
                <span>18:00</span>
                <a href="javascript:;">IOS的高级进阶之路</a>
              </li>
            </ul>
          </div>
        </div>

        <!-- 分割图片 -->
        <div
          class="mod-sub img-entry-wrapper js-img-entry"
          style="margin-bottom: 55px; width: 100%; padding-top: 30px"
        >
          <a
            class="img-entry"
            href="javascript:;"
            style="
              background: url('../images/index/fenGe.png') no-repeat center;
              cursor: pointer;
              display: block;
              background-position: 50%;
              max-width: 1200px;
              margin: 0 auto;
              min-height: 220px;
            "
          >
          </a>
        </div>

        <!-- 腾讯课堂官方推荐 -->
        <h2 style="padding: 70px 0 40px 0; border-bottom: 5px solid #f4f4f4">
          腾讯课堂官方推荐：前端开发零基础入门训练营
        </h2>
        <ul class="recommended_area" style="margin-bottom: 55px">
          <li>
            <a class="item-hd" title="前端权威0基础训练营" href="javascript:;">
              <img
                class="item-cover"
                src="../images/index/recommended1.jpg"
                alt="封面背景"
              />
              <div class="item-hd-mask"></div>
              <div class="item-hd-wrap">
                <h3 class="item-tt">前端权威0基础训练营</h3>
                <p class="item-wording">适合对象：在职转行，应届毕业生</p>
                <p class="item-wording">平均薪资：10K+</p>
              </div>
            </a>
            <div class="item-bd">
              <a
                class="item-bd-wrap js-series-content"
                title="前端权威0基础训练营"
                href=""
                style="max-height: 160px"
              >
                <h4 class="item-ctt">渡一教育 实战项目</h4>
                <p class="item-content">
                  01 <span class="item-wording-txt">前端权威0基础入门</span>
                </p>
                <p class="item-content">
                  02 <span class="item-wording-txt">Web百大项目案例</span>
                </p>
                <p class="item-content">
                  03
                  <span class="item-wording-txt"
                    >深化基础和夯实底层编程能力</span
                  >
                </p>
              </a>
            </div>
          </li>
          <li>
            <a class="item-hd" title="高薪就业训练营" href="javascript:;">
              <img
                class="item-cover"
                src="../images/index/recommended2.jpg"
                alt="封面背景"
              />
              <div class="item-hd-mask"></div>
              <div class="item-hd-wrap">
                <h3 class="item-tt">高薪就业训练营</h3>
                <p class="item-wording">适合对象：在职转行，应届毕业生</p>
                <p class="item-wording">平均薪资：10K+</p>
              </div>
            </a>
            <div class="item-bd">
              <a
                class="item-bd-wrap js-series-content"
                title="高薪就业训练营"
                href="javascript:;"
                style="max-height: 160px"
              >
                <h4 class="item-ctt">职坐标 实战项目</h4>
                <p class="item-content">
                  01
                  <span class="item-wording-txt">保姆级课程服务治愈懒癌</span>
                </p>
                <p class="item-content">
                  02
                  <span class="item-wording-txt"
                    >零基础到精通，项目驱动式教学</span
                  >
                </p>
                <p class="item-content">
                  03
                  <span class="item-wording-txt"
                    >VIP就业通道限时开启，就业无压力</span
                  >
                </p>
              </a>
            </div>
          </li>
          <li>
            <a class="item-hd" title="零基础就业课" href="javascript:;">
              <img
                class="item-cover"
                src="../images/index/recommended3.jpg"
                alt="封面背景"
              />
              <div class="item-hd-mask"></div>
              <div class="item-hd-wrap">
                <h3 class="item-tt">零基础就业课</h3>
                <p class="item-wording">适合对象：想要转行，想拿高薪的同学</p>
                <p class="item-wording">入行平均薪资：8k</p>
              </div>
            </a>
            <div class="item-bd">
              <a
                class="item-bd-wrap js-series-content"
                title="零基础就业课"
                href="javascript:;"
                style="max-height: 160px"
              >
                <h4 class="item-ctt">六星教育 实战项目</h4>
                <p class="item-content">
                  01
                  <span class="item-wording-txt">零基础高薪就业快速入门</span>
                </p>
                <p class="item-content">
                  02 <span class="item-wording-txt">理论+项目案例结合讲解</span>
                </p>
                <p class="item-content">
                  03
                  <span class="item-wording-txt">10S服务体系保障高薪就业</span>
                </p>
              </a>
            </div>
          </li>
          <li>
            <a class="item-hd" title="实战项目训练营" href="javascript:;">
              <img
                class="item-cover"
                src="../images/index/recommended4.jpg"
                alt="封面背景"
              />
              <div class="item-hd-mask"></div>
              <div class="item-hd-wrap">
                <h3 class="item-tt">实战项目训练营</h3>
                <p class="item-wording">适合对象：零基础小白</p>
                <p class="item-wording">学员平均薪资：8K+</p>
              </div>
            </a>
            <div class="item-bd">
              <a
                class="item-bd-wrap js-series-content"
                title="实战项目训练营"
                href="javascript:;"
                style="max-height: 160px"
              >
                <h4 class="item-ctt">小码哥教育 实战项目</h4>
                <p class="item-content">
                  01 <span class="item-wording-txt">快速入门前端开发</span>
                </p>
                <p class="item-content">
                  02 <span class="item-wording-txt">即学即用的大厂技术</span>
                </p>
                <p class="item-content">
                  03 <span class="item-wording-txt">解决找工作难的问题</span>
                </p>
              </a>
            </div>
          </li>
        </ul>
      </div>
    </section>
    <section class="container">
      <div class="cate_item" id="xingqu">
        <!-- 热门知识 -->
        <h2 style="padding: 0px 0 40px 0">热门知识</h2>
        <div class="knowledge">
          <a href="javascript:;"
            >mpacc培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>

          <a href="javascript:;">
            php培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            plc编程培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            淘宝运营培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            算法工程师培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            游戏开发培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            物联网培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ga培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            人工智能培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ie工程师培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            安卓系统培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            产品培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            asp培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            软件开发培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            思维导图培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            电脑培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            程序员培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            编程培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            cad2014安装教程
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            cnc编程培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            交互设计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            软装设计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ps教程
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            unity培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            视觉传达设计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            零基础素描培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ps怎么抠图
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            服装制作培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            版面设计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            影视剪辑培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            视频编辑培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ps如何抠图
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            平面培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            3d特效培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            电商美工培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            ps字体
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>

          <a href="javascript:;">
            注会培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a>
            我
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use>
            </svg>
          </a>
          <a href="javascript:;">
            医院管理培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            会计培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            财务管理培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            工程测量员培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            公务员培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            水电工培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            政法培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            国际贸易培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            婚礼主持人培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            导游培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            医师培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            内审培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            家政培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            cfa培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            电焊培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            护师培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            传媒培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            汽车维修培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            礼仪培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            奥数培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            小学奥数培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            初中教育培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            党员培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            考研培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            作文培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            专升本培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            手绘pop培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            考研英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            高中化学培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            医学考研培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            物理培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语四级培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语六级培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            速算培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            寿司培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            舞蹈培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            自信培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            拳击培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            创业培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            儿童舞蹈培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            唢呐培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            化妆培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            瑜伽培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            周易培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            美容培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            理发培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            采耳培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            体操培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            传统文化培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            肚皮舞培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            美容美发培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            轮滑培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            架子鼓培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            彩妆培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            西班牙语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            托福培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            雅思培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            日语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            法语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            bec高级培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            雅思班培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            俄语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            韩语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            少儿英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语口语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            情商培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            一对一英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            出国留学培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            新概念英语培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            gmat培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            toefl培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
          <a href="javascript:;">
            英语专八培训
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-chahao"></use></svg
          ></a>
        </div>
      </div>
    </section>
    <!-- 合作部分 -->
    <section class="wrap-bg-dark-gray">
      <div class="container">
        <h3 class="cooperation-title">合作链接</h3>
        <ul>
          <li>
            <span> 腾讯大学</span>
          </li>
          <li>
            <span> 腾讯网</span>
          </li>
          <li>
            <span> 教育频道</span>
          </li>
          <li>
            <span> 腾讯精品课</span>
          </li>
          <li>
            <span> 腾讯云</span>
          </li>
          <li>
            <span> 腾讯企点</span>
          </li>
          <li>
            <span> 腾讯电脑管家</span>
          </li>
          <li>
            <span> 腾讯御安全</span>
          </li>
          <li>
            <span> 企鹅FM</span>
          </li>
          <li>
            <span> 腾讯微云</span>
          </li>
          <li>
            <span> 腾讯文档</span>
          </li>
          <li>
            <span> 腾讯游戏学院</span>
          </li>
          <li>
            <span> 环球网校</span>
          </li>
          <li>
            <span> 中华考试网</span>
          </li>
          <li>
            <span> 学神IT教育</span>
          </li>
          <li>
            <span> 云艺帆教育</span>
          </li>
          <li>
            <span> 为课网校</span>
          </li>
          <li>
            <span> 中大网校</span>
          </li>
          <li>
            <span> 益修学院</span>
          </li>
          <li>
            <span> 起点学院</span>
          </li>
          <li>
            <span> 人人都是产品经理</span>
          </li>
          <li>
            <span> 公务员考试网</span>
          </li>
          <li>
            <span> 新东方在线</span>
          </li>
          <li>
            <span> 中公公务员网</span>
          </li>
          <li>
            <span> 学科网</span>
          </li>
          <li>
            <span> 原画人</span>
          </li>
          <li>
            <span> 王羽课堂</span>
          </li>
        </ul>
      </div>
    </section>
    <!-- 底部 -->
    <footer class="tx_footer_area">
      <img src="../images/index/footer.png" alt="" />
      <p>Copyright © 2020 Tencent. All Rights Reserved.</p>
      <p>
        深圳市腾讯计算机系统有限公司 版权所有 |
        <a href="./clause.html">腾讯课堂服务协议</a>
        | <a href="javascript:;">隐私政策</a> |
        <a href="javascript:;">站点地图</a> |
        <a href="javascript:;">侵权投诉</a> |
        <a href="javascript:;" rel="nofollow">问题反馈</a>
        | <a href="javascript:;">帮助</a> |
        <a href="javascript:;">涨知识</a>
      </p>

      <p></p>
    </footer>
    <script src="../js/jquery.min.js"></script>
    <script src="../js/base.js"></script>
    <script src="../js/index.js"></script>
    <script src="../js/swiper.min.js"></script>
    <script>
      var swiper = new Swiper(".swiper-container", {
        autoplay: {
          delay: 3000, //用户操作后是否被禁掉
          disableOnInteraction: false,
        },
        spaceBetween: 30,
        loop: true,
        effect: "fade",
        pagination: {
          el: ".swiper-pagination",
          clickable: true,
        },
        navigation: {
          nextEl: ".swiper-button-next",
          prevEl: ".swiper-button-prev",
        },
      });
    </script>
  </body>
</html>
